<template>
	<view :class="'text-message ' + (isMine?'my-text':'')">
		<view v-for="(item, index) in renderDom" :key="index" class="message-body-span"
			style="font-size:32rpx;font-family: PingFang SC;font-weight: 500;color: #131313;">
			<span class="message-body-span-text" v-if="item.name === 'span'"><text
					v-if="isAtAll">{{lang.chat_group_notice}}：\n</text>{{item.text}}</span>
			<image v-if="item.name === 'img'" class="emoji-icon" :src="item.src"></image>
		</view>
	</view>
</template>

<script>
	import {
		parseText
	} from "../../../base/message-facade";

	export default {
		data() {
			return {
				renderDom: [],
				info: {},
				isAtAll: false,
				// gravity: 'top',
				tooltipShow: false,
				tooltipBtns: ['撤回'],
				eleId: '',
				offsetTop: 0
			};
		},
		components: {},
		props: {
			message: {
				type: Object,
			},
			lang: {
				type: Object,
				default: () => {}
			},
			isMine: {
				type: Boolean,
				default: true
			},
			scrollTopPage: {
				type: Number,
				default: 0
			},
		},
		watch: {
			message: {
				handler: function(newVal) {
					if (newVal.payload.text.indexOf('【群公告】') !== -1) {
						this.setData({
							isAtAll: true,
						});
						newVal.payload.text = newVal.payload.text.replace('【群公告】', '');
					}
					this.setData({
						renderDom: parseText(newVal),
						info: newVal,
					});
				},
				immediate: true,
				deep: true
			}
		},

		beforeMount() { // 在组件实例进入页面节点树时执行
		},

		destroyed() { // 在组件实例被从页面节点树移除时执行
		},
		mounted() {},
		methods: {}
	};
</script>
<style>
	@import "./index.css";
</style>
